<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<!-- Head 开始 -->

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 告诉浏览器对屏幕宽度做出响应 -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>订单</title>
    <!-- 主要样式表开始 -->
    <link href="/assets/css/main.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="/css/order.css">
    <!-- favicon图标 -->
    <link type="image/png" rel="shortcut icon" href="/assets/images/favicon.png">
</head>
<!-- Head 结束 -->

<body>
<!-- 预加载部分开始 -->
<div id="preloader">
    <div id="status"></div>
</div>
<!-- 预加载部分结束 -->

<!--主体开始-->
<div id="Catalog">
    <table>
        <tr>
            <th colspan="2">Payment Details</th>
        </tr>
        <tr>
            <td>Card Type:</td>
            <td>
                <input type="text" id="cardTypeInput" th:value="${orderToShow.cardType}">
            </td>
        </tr>
        <tr>
            <td>Card Number:</td>
            <td>
                <input type="text" id="cardNumberInput" th:value="${orderToShow.creditCard}">
                <span>*Use a fake number!</span>
            </td>
        </tr>
        <tr>
            <td>Expiry Date (MM/YYYY):</td>
            <td>
                <input type="text" id="expiryDateInput" th:value="${orderToShow.exprDate}">
            </td>
        </tr>
        <tr>
            <td colspan="2">Billing Address</td>
        </tr>
        <tr>
            <td>First name:</td>
            <td>
                <input type="text" id="billFirstNameInput" th:value="${orderToShow.billFirstName}">
            </td>
        </tr>
        <tr>
            <td>Last name:</td>
            <td>
                <input type="text" id="billLastNameInput" th:value="${orderToShow.billLastName}">
            </td>
        </tr>
        <tr>
            <td>Address 1:</td>
            <td>
                <input type="text" id="billAddr1Input" th:value="${orderToShow.billAddr1}">
            </td>
        </tr>
        <tr>
            <td>Address 2:</td>
            <td>
                <input type="text" id="billAddr2Input" th:value="${orderToShow.billAddr2}">
            </td>
        </tr>
        <tr>
            <td>City:</td>
            <td>
                <input type="text" id="billCityInput" th:value="${orderToShow.billCity}">
            </td>
        </tr>
        <tr>
            <td>State:</td>
            <td>
                <input type="text" id="billStateInput" th:value="${orderToShow.billState}">
            </td>
        </tr>
        <tr>
            <td>Zip:</td>
            <td>
                <input type="text" id="billZipInput" th:value="${orderToShow.billZip}">
            </td>
        </tr>
        <tr>
            <td>Country:</td>
            <td>
                <input type="text" id="billCountryInput" th:value="${orderToShow.billCountry}">
            </td>
        </tr>
    </table>
    <a href="/order/add"><b>Submit</b></a>
</div>
<!--主体结束-->

<!-- jQuery (Bootstrap的JavaScript插件必需) -->
<script src="/assets/js/jquery-3.4.1.min.js"></script>
<!-- Bootstrap js文件 -->
<script src="/assets/js/bootstrap.bundle.min.js"></script>
<!-- swiper文件 -->
<script src="/assets/js/swiper.min.js"></script>
<!-- 作品展示js文件 -->
<script src="/assets/js/jquery.mixitup.min.js"></script>
<!-- 站点主js文件 -->
<script src="/assets/js/main.js"></script>

</body>

</html>